From 180c9577f8337991ca71470816333fe8430cd3ca Mon Sep 17 00:00:00 2001
From: real-zephex <zephex-1@outlook.com>
Date: Fri, 24 May 2024 22:51:36 +0530
Subject: =?UTF-8?q?=E2=9C=A8=20feat(ui):=20=F0=9F=8E=A8=20migrate=20from?=
 =?UTF-8?q?=20vanilla=20css=20to=20tailwind=20css,=20adopted=20next=20ui?=
 =?UTF-8?q?=20and=20restructured?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/kdrama/[id]/page.jsx | 92 +++++++++++++++++---------------------------
 1 file changed, 36 insertions(+), 56 deletions(-)

(limited to 'src/app/kdrama/[id]/page.jsx')

diff --git a/src/app/kdrama/[id]/page.jsx b/src/app/kdrama/[id]/page.jsx
index 9cb3cd8..d94810e 100644
--- a/src/app/kdrama/[id]/page.jsx
+++ b/src/app/kdrama/[id]/page.jsx
@@ -1,66 +1,46 @@
-import styles from "../styles/info.module.css";
-import Image from "next/image";
-import EpisodesButtons from "./buttons";
-import { PreFetchVideoLinks } from "../components/cacher";
+import { Chip, Image } from "@nextui-org/react";
+import DescriptionTabs from "../components/infoTabs";
+import { dramaInfo } from "../components/requests";
+import EpisodesContainer from "../components/episodesContainer";
 
 export default async function DramaInfo({ params }) {
 	const id = decodeURIComponent(params.id);
-	const info = await getDramaInfo(id);
-
-	PreFetchVideoLinks(info.episodes, id);
+	const data = await dramaInfo(id);
 
 	return (
-		<div className={styles.Main}>
-			{info && (
-				<div className={styles.DramaInfoContainer}>
-					<div className={styles.TitleContainer}>
-						<p>{info.title}</p>
-						<Image
-							src={`https://sup-proxy.zephex0-f6c.workers.dev/api-content?url=${info.image}`}
-							width={175}
-							height={256}
-							alt="Drama Poster"
-							priority
-						/>
-					</div>
-
-					{/* Drama description */}
-					<div className={styles.DramaDescription}>
-						<h2>Description</h2>
-						<p>{info.description}</p>
-					</div>
-
-					{/* Genres */}
-					<div className={styles.DramaGenre}>
-						<span className={styles.genreMain}>Genres: </span>
-						{info.genres &&
-							info.genres.map((item, index) => (
-								<p key={index}>{item}</p>
-							))}
-					</div>
-
-					{/* Other names */}
-					<div className={styles.DramaGenre}>
-						<span className={styles.genreMain}>AKA: </span>
-						{info.otherNames &&
-							info.otherNames.map((item, index) => (
-								<p key={index}>{item}</p>
+		<section className="pt-12  lg:w-9/12 m-auto">
+			<div className="flex items-center justify-center lg:justify-start md:justify-start">
+				<Image
+					isBlurred
+					width={190}
+					src={data.image.toString()}
+					alt="Anime Title Poster"
+					className="m-2"
+				/>
+				<div className="mx-5">
+					<h4 className={`text-2xl`}>
+						<strong>{data.title}</strong>
+					</h4>
+					<div className="mt-1">
+						{data.genres &&
+							data.genres.map((item, index) => (
+								<Chip
+									key={index}
+									color="warning"
+									variant="faded"
+									className="mr-1 mb-1"
+								>
+									<p className="text-xs">{item}</p>
+								</Chip>
 							))}
 					</div>
-
-					{/* Episodes Buttons */}
-					<EpisodesButtons data={info.episodes} id={id} />
 				</div>
-			)}
-		</div>
-	);
-}
-
-async function getDramaInfo(id) {
-	const res = await fetch(
-		`https://consumet-jade.vercel.app/movies/dramacool/info?id=${id}`,
-		{ next: { revalidate: 21600 } }
+			</div>
+			<DescriptionTabs data={data} />
+			<EpisodesContainer data={data} />
+			<br />
+			<br />
+			<br />
+		</section>
 	);
-	const data = await res.json();
-	return data;
 }
-- 
cgit v1.2.3